<template>
  <div>
    <van-swipe :autoplay="3000">
      <!-- <van-swipe-item v-for="(image, index) in images" :key="image.id" >
        <img :src="image.img" alt="">
      </van-swipe-item> -->
      <van-swipe-item >
        <img src="../assets/1.2.jpg" alt="">
      </van-swipe-item>
      <van-swipe-item >
        <img src="../assets/1.jpg" alt="">
      </van-swipe-item>
      <van-swipe-item >
        <img src="../assets/20185609105606277.jpg" alt="">
      </van-swipe-item>
    </van-swipe>
    <van-grid :border="false" :column-num="3">
      <van-grid-item to="/newslist">
        <img src="../assets/images/menu1.png" alt="">
        <p>新闻资讯</p>
      </van-grid-item>
      <van-grid-item to="/photolist">
        <img src="../assets/images/menu2.png" alt="">
        <p>图片分享</p>
      </van-grid-item>
      <van-grid-item to="/goodslist">
        <img src="../assets/images/menu3.png" alt="">
        <p>商品列表</p>
      </van-grid-item>
      <van-grid-item>
        <img src="../assets/images/menu4.png" alt="">
        <p>留言反馈</p>
      </van-grid-item>
      <van-grid-item to="/contact">
        <img src="../assets/images/menu6.png" alt="">
        <p>联系我们</p>
      </van-grid-item>
      <van-grid-item to="/coupon">
        <img src="../assets/images/menu7.gif" alt="">
        <p>优惠券</p>
      </van-grid-item>
      <van-grid-item to="/map">
        <img src="../assets/images/menu1.png" alt="">
        <p>地图</p>
      </van-grid-item>
      <van-grid-item to="/form-validate">
        <img src="../assets/images/menu1.png" alt="">
        <p>表单验证</p>
      </van-grid-item>
    </van-grid>
  </div>
</template>
<script>
export default {
  created(){
    this.getSwiper()
  },
  data() {
    return {
      images: []
    };
  },
  methods: {
    async getSwiper(){
          const {data:res} = await this.$http.get('/api/getlunbo')
          if(res.status != 0)return this.$toast.error('请求数据失败')
          this.images = res.message 
      }
  }
};
</script>
<style scoped lang="less">
.van-swipe {
  width:100%;
  height: 200px;
  .van-swipe-item {
    width:100%;
    text-align: center;
    img {
      width:100%;
      height: 200px;
    }
  }
}
.van-grid-item{
  width:1 / 3 * 100%;
  img{
    width:70px;
  }
}
</style>